.arco-input-wrapper {
  display: inline-flex;
  box-sizing: border-box;
  width: 100%;
  padding-right: 12px;
  padding-left: 12px;
  color: $color-text-1;
  font-size: 14px;
  background-color: $color-fill-2;
  border: 1px solid transparent;
  border-radius: $border-radius-small;
  cursor: text;
  transition:
    color 0.1s cubic-bezier(0, 0, 1, 1),
    border-color 0.1s cubic-bezier(0, 0, 1, 1),
    background-color 0.1s cubic-bezier(0, 0, 1, 1);
}
.arco-input-wrapper:hover {
  background-color: $color-fill-3;
  border-color: transparent;
}
// .arco-input-wrapper:focus-within,
// .arco-input-wrapper.arco-input-focus {
//   z-index: 1;
//   background-color: $color-bg-2;
//   border-color: $primary-6;
//   box-shadow: 0 0 0 0 $color-primary-light-2;
// }
.arco-input-wrapper.arco-input-disabled {
  color: $color-text-4;
  background-color: $color-fill-2;
  border-color: transparent;
  cursor: not-allowed;
}
.arco-input-wrapper.arco-input-disabled:hover {
  color: $color-text-4;
  background-color: $color-fill-2;
  border-color: transparent;
}
.arco-input-wrapper.arco-input-disabled .arco-input-prefix,
.arco-input-wrapper.arco-input-disabled .arco-input-suffix {
  color: inherit;
}
.arco-input-wrapper.arco-input-error {
  background-color: $color-danger-light-1;
  border-color: transparent;
}
.arco-input-wrapper.arco-input-error:hover {
  background-color: $color-danger-light-2;
  border-color: transparent;
}
// .arco-input-wrapper.arco-input-error:focus-within,
// .arco-input-wrapper.arco-input-error.arco-input-wrapper-focus {
//   z-index: 1;
//   background-color: $color-bg-2;
//   border-color: rgb(var(--danger-6));
//   box-shadow: 0 0 0 0 $color-danger-light-2;
// }
.arco-input-wrapper .arco-input-prefix,
.arco-input-wrapper .arco-input-suffix {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  white-space: nowrap;
  user-select: none;
}
// .arco-input-wrapper .arco-input-prefix > svg,
// .arco-input-wrapper .arco-input-suffix > svg {
//   font-size: 14px;
// }
.arco-input-wrapper .arco-input-prefix {
  padding-right: 12px;
  color: $color-text-2;
}
.arco-input-wrapper .arco-input-suffix {
  padding-left: 12px;
  color: $color-text-2;
}
// .arco-input-wrapper .arco-input-suffix .arco-feedback-icon {
//   display: inline-flex;
// }
// .arco-input-wrapper .arco-input-suffix .arco-feedback-icon-status-validating {
//   color: $primary-6;
// }
// .arco-input-wrapper .arco-input-suffix .arco-feedback-icon-status-success {
//   color: rgb(var(--success-6));
// }
// .arco-input-wrapper .arco-input-suffix .arco-feedback-icon-status-warning {
//   color: rgb(var(--warning-6));
// }
// .arco-input-wrapper .arco-input-suffix .arco-feedback-icon-status-error {
//   color: rgb(var(--danger-6));
// }
.arco-input-wrapper .arco-input-clear-btn {
  align-self: center;
  color: $color-text-2;
  font-size: 12px;
  visibility: hidden;
  cursor: pointer;
}
// .arco-input-wrapper .arco-input-clear-btn > svg {
//   position: relative;
//   transition: color 0.1s cubic-bezier(0, 0, 1, 1);
// }
.arco-input-wrapper:hover .arco-input-clear-btn {
  visibility: visible;
}
// .arco-input-wrapper:not(.arco-input-focus) .arco-input-icon-hover:hover::before {
//   background-color: var(--color-fill-4);
// }
.arco-input-wrapper .arco-input {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
  color: inherit;
  line-height: 1.5715;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  cursor: inherit;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
// .arco-input-wrapper .arco-input::placeholder {
//   color: $color-text-3;
// }
.arco-input-wrapper .arco-input[disabled]::placeholder {
  color: $color-text-4;
}
.arco-input-wrapper .arco-input[disabled] {
  -webkit-text-fill-color: $color-text-4;
}
.arco-input-wrapper .arco-input.arco-input-size-mini {
  /* prettier-ignore */
  padding-top: 1px;
  /* prettier-ignore */
  padding-bottom: 1px;
  font-size: 12px;
  line-height: 1.667;
}
.arco-input-wrapper .arco-input.arco-input-size-small {
  /* prettier-ignore */
  padding-top: 2px;
  /* prettier-ignore */
  padding-bottom: 2px;
  font-size: 14px;
  line-height: 1.5715;
}
.arco-input-wrapper .arco-input.arco-input-size-medium {
  /* prettier-ignore */
  padding-top: 4px;
  /* prettier-ignore */
  padding-bottom: 4px;
  font-size: 14px;
  line-height: 1.5715;
}
.arco-input-wrapper .arco-input.arco-input-size-large {
  /* prettier-ignore */
  padding-top: 6px;
  /* prettier-ignore */
  padding-bottom: 6px;
  font-size: 14px;
  line-height: 1.5715;
}
.arco-input-wrapper .arco-input-word-limit {
  color: $color-text-3;
  font-size: 12px;
}
.arco-input-outer {
  display: inline-flex;
  width: 100%;
}
.arco-input-outer > .arco-input-wrapper {
  border-radius: 0;
}
// .arco-input-outer > :first-child {
//   border-top-left-radius: $border-radius-small;
//   border-bottom-left-radius: $border-radius-small;
// }
// .arco-input-outer > :last-child {
//   border-top-right-radius: $border-radius-small;
//   border-bottom-right-radius: $border-radius-small;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-outer {
//   font-size: 12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-wrapper .arco-input-prefix,
// .arco-input-outer.arco-input-outer-size-mini .arco-input-wrapper .arco-input-suffix {
//   font-size: 12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-wrapper .arco-input-prefix > svg,
// .arco-input-outer.arco-input-outer-size-mini .arco-input-wrapper .arco-input-suffix > svg {
//   font-size: 12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend,
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append {
//   font-size: 12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend > svg,
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append > svg {
//   font-size: 12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
//   border-color: transparent;
//   border-top-left-radius: 0;
//   border-bottom-left-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-prepend .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
//   border-color: transparent;
//   border-top-right-radius: 0;
//   border-bottom-right-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-mini .arco-input-append .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-outer {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-wrapper .arco-input-prefix,
// .arco-input-outer.arco-input-outer-size-small .arco-input-wrapper .arco-input-suffix {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-wrapper .arco-input-prefix > svg,
// .arco-input-outer.arco-input-outer-size-small .arco-input-wrapper .arco-input-suffix > svg {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend,
// .arco-input-outer.arco-input-outer-size-small .arco-input-append {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend > svg,
// .arco-input-outer.arco-input-outer-size-small .arco-input-append > svg {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
//   border-color: transparent;
//   border-top-left-radius: 0;
//   border-bottom-left-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-prepend .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-append .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
//   border-color: transparent;
//   border-top-right-radius: 0;
//   border-bottom-right-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-append .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-append .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-small .arco-input-append .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-outer {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-wrapper .arco-input-prefix,
// .arco-input-outer.arco-input-outer-size-large .arco-input-wrapper .arco-input-suffix {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-wrapper .arco-input-prefix > svg,
// .arco-input-outer.arco-input-outer-size-large .arco-input-wrapper .arco-input-suffix > svg {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend,
// .arco-input-outer.arco-input-outer-size-large .arco-input-append {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend > svg,
// .arco-input-outer.arco-input-outer-size-large .arco-input-append > svg {
//   font-size: 14px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
//   border-color: transparent;
//   border-top-left-radius: 0;
//   border-bottom-left-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-prepend .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-append .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
//   border-color: transparent;
//   border-top-right-radius: 0;
//   border-bottom-right-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-append .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-append .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-outer.arco-input-outer-size-large .arco-input-append .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
.arco-input-outer-disabled {
  cursor: not-allowed;
}
.arco-input-prepend,
.arco-input-append {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  box-sizing: border-box;
  padding: 0 12px;
  color: $color-text-1;
  white-space: nowrap;
  background-color: $color-fill-2;
  border: 1px solid transparent;
}
// .arco-input-prepend > svg,
// .arco-input-append > svg {
//   font-size: 14px;
// }
.arco-input-prepend {
  border-right: 1px solid $color-neutral-3;
}
// .arco-input-prepend .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
//   border-color: transparent;
//   border-top-right-radius: 0;
//   border-bottom-right-radius: 0;
// }
// .arco-input-prepend .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -12px;
//   margin-left: -13px;
// }
// .arco-input-prepend .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-prepend .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
.arco-input-append {
  border-left: 1px solid $color-neutral-3;
}
// .arco-input-append .arco-input {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
//   border-color: transparent;
//   border-top-left-radius: 0;
//   border-bottom-left-radius: 0;
// }
// .arco-input-append .arco-select {
//   width: auto;
//   height: 100%;
//   margin-top: -1px;
//   margin-bottom: -1px;
//   margin-right: -13px;
//   margin-left: -12px;
// }
// .arco-input-append .arco-select .arco-select-view {
//   background-color: inherit;
//   border-color: transparent;
//   border-radius: 0;
// }
// .arco-input-append .arco-select.arco-select-single .arco-select-view {
//   height: 100%;
// }
// .arco-input-group {
//   display: inline-flex;
//   align-items: center;
// }
// .arco-input-group > * {
//   border-radius: 0;
// }
// .arco-input-group > *.arco-input-outer > :last-child,
// .arco-input-group > *.arco-input-outer > :first-child {
//   border-radius: 0;
// }
// .arco-input-group > *:not(:last-child) {
//   position: relative;
//   box-sizing: border-box;
// }
// .arco-input-group > *:first-child,
// .arco-input-group > *:first-child .arco-input-group > *:first-child {
//   border-top-left-radius: $border-radius-small;
//   border-bottom-left-radius: $border-radius-small;
// }
// .arco-input-group > *:first-child .arco-select-view,
// .arco-input-group > *:first-child .arco-input-group > *:first-child .arco-select-view {
//   border-top-left-radius: $border-radius-small;
//   border-bottom-left-radius: $border-radius-small;
// }
// .arco-input-group > *:last-child,
// .arco-input-group > *:last-child .arco-input-outer > *:last-child {
//   border-top-right-radius: $border-radius-small;
//   border-bottom-right-radius: $border-radius-small;
// }
// .arco-input-group > *:last-child .arco-select-view,
// .arco-input-group > *:last-child .arco-input-outer > *:last-child .arco-select-view {
//   border-top-right-radius: $border-radius-small;
//   border-bottom-right-radius: $border-radius-small;
// }
// .arco-input-group > .arco-input-wrapper:not(:last-child),
// .arco-input-group > .arco-input-outer:not(:last-child),
// .arco-input-group > .arco-input-tag:not(:last-child),
// .arco-input-group > .arco-select-view:not(:last-child) {
//   margin-right: -1px;
//   border-right: 1px solid $color-neutral-3;
// }
// .arco-input-group > .arco-input-wrapper:not(:last-child):focus-within,
// .arco-input-group > .arco-input-outer:not(:last-child):focus-within,
// .arco-input-group > .arco-input-tag:not(:last-child):focus-within,
// .arco-input-group > .arco-select-view:not(:last-child):focus-within {
//   border-right-color: $primary-6;
// }
// .arco-input-group > .arco-input-wrapper.arco-input-error:not(:last-child):focus-within {
//   border-right-color: rgb(var(--danger-6));
// }
// .size-height-size-mini {
//   /* prettier-ignore */
//   padding-top: 1px;
//   /* prettier-ignore */
//   padding-bottom: 1px;
//   font-size: 12px;
//   line-height: 1.667;
// }
// .size-height-size-small {
//   /* prettier-ignore */
//   padding-top: 2px;
//   /* prettier-ignore */
//   padding-bottom: 2px;
//   font-size: 14px;
// }
// .size-height-size-large {
//   /* prettier-ignore */
//   padding-top: 6px;
//   /* prettier-ignore */
//   padding-bottom: 6px;
//   font-size: 14px;
// }
// .arco-textarea-wrapper {
//   position: relative;
//   display: inline-block;
//   width: 100%;
// }
// .arco-textarea-clear-wrapper:hover .arco-textarea-clear-icon {
//   display: inline-block;
// }
// .arco-textarea-clear-wrapper .arco-textarea {
//   padding-right: 20px;
// }
// .arco-textarea-word-limit {
//   position: absolute;
//   right: 10px;
//   bottom: 6px;
//   color: $color-text-3;
//   font-size: 12px;
//   user-select: none;
// }
// .arco-textarea-clear-icon {
//   position: absolute;
//   top: 10px;
//   right: 10px;
//   display: none;
//   font-size: 12px;
// }
// .arco-input-search .arco-input-append {
//   padding: 0;
//   border: none;
// }
// .arco-input-search .arco-input-suffix {
//   color: $color-text-2;
//   font-size: 14px;
// }
// .arco-input-search .arco-input-search-btn {
//   border-top-left-radius: 0;
//   border-bottom-left-radius: 0;
// }
// .arco-input-wrapper.arco-input-password:not(.arco-input-disabled) .arco-input-suffix {
//   color: $color-text-2;
//   font-size: 12px;
//   cursor: pointer;
// }
